<template>

 <div>

   <el-row>
     <el-col :span="3" v-for="o in findAllGoods" :key="o">
       <el-card :body-style="{ padding: '0px' }"
                style="width: 130px">
         <!--<img src="o.image" class="image">-->
         <el-image
           style="width: 130px; height: 100px"
           :src="o.img"
           class="image"></el-image>
         <div style="padding: 0px;">
           <span>{{o.goodsName}}</span>
           <div>价格:{{o.price}}元</div>
           <div>热度:{{o.goodsNumber}}</div>

           <div class="bottom clearfix">
             <el-button type="text" class="button" @click="detailGood(o.id)">进入详情</el-button>
           </div>

         </div>
       </el-card>
     </el-col>
   </el-row>
 </div>

</template>

<script>
    export default {
        name: "goods",
        data(){
          return{
            findAllGoods:[]
          }
        },
      methods:{
        allGood:function () {
          this.$axios.get("/goods/findAllGoods").then(res=>{
            this.findAllGoods=res.data;
          })
        },
        detailGood:function (id) {
          this.$router.push({name:"good",params:{id:id}})
        }
      },
      mounted(){
          this.allGood();
      }
    }
</script>

<style scoped>

</style>
